<template>
	<div class="content">
		<!--<div class="add">
			<Button type="primary" class="fr" @click="modal2 = true;">添加</Button>
		</div>-->
		<Table stripe :columns="columns" :data="configList" ref="table" :loading="loading"></Table>
		<Modal v-model="modal1" title="修改配置" width='40%' :mask-closable="false">
			<Form :label-width="150">
				<FormItem label="等级名称">
					<Input class="w-50" v-model="edit.nodeName" />
				</FormItem>
				<FormItem label="节点全网奖励比例">
					<Input class="w-50" v-model.trim="edit.allRatio" placeholder="请输入配置值" />
				</FormItem>
				<FormItem label="账户价值(USDT)">
					<Input class="w-50" v-model.trim="edit.conditionAccoutValue" placeholder="请输入配置值" />
				</FormItem>
				<FormItem label="节点下所有会员业绩(USDT)">
					<Input class="w-50" v-model.trim="edit.conditionNodeValue" placeholder="请输入配置值" />
				</FormItem>
				<FormItem label="节点奖励比例">
					<Input class="w-50" v-model.trim="edit.ratio" placeholder="请输入配置值" />
					<p>
						<font color="#ed4014">* 节点奖励比例只有两位小数</font>
					</p>
				</FormItem>
			</Form>
			<div slot="footer">
				<Button type="text" size="large" @click="modal1 = false;edit.allRatio = ''; edit.conditionAccoutValue = '';edit.conditionNodeValue = '';edit.ratio = '';">取消</Button>
				<Button type="primary" size="large" @click="editSubmit()">确定</Button>
			</div>
		</Modal>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				page: 1,
				pageSize: 1000,
				configList: [],
				modal1: false,
				modal2: false,
				loading: true,
				edit: {
					conditionNodeValue: '',
					conditionAccoutValue: '',
					allRatio: '',
					id: '',
					nodeId: '',
					ratio: '',
					nodeName: '',
				},
				columns: [{
						title: '等级名称',
						key: 'nodeName',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.nodeName == null ? '#' : params.row.nodeName)
						}
					},
					{
						title: '节点全网奖励比例',
						key: 'allRatio',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.allRatio == null ? '#' : params.row.allRatio)
						}
					},
					{
						title: '账户价值(USDT)',
						key: 'conditionAccoutValue',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.conditionAccoutValue == null ? '#' : params.row.conditionAccoutValue)
						}
					},
					{
						title: '节点下所有会员业绩(USDT)',
						key: 'conditionNodeValue',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.conditionNodeValue == null ? '#' : params.row.conditionNodeValue)
						}
					},
					{
						title: '节点奖励比例',
						key: 'ratio',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.ratio == null ? '#' : params.row.ratio)
						}
					},
					{

						title: '操作',
						key: 'action',
						align: 'center',
						render: (h, params) => {
							return h('div', [
								h(
									'Button', {
										props: {
											type: 'primary',
											size: 'small',
										},
										style: {
											marginRight: '5px'
										},
										on: {
											click: () => {
												this.modal1 = true;
												this.axios.get('/admin/settings/node_config/' + params.row.id).then(res => {
													if(res.data.code == 200) {
														this.edit = res.data.data;
													}
												})
											}
										}
									},
									'编辑'
								),
							])
						}

					}
				]
			}
		},
		created() {

		},
		mounted() {
			this.$Message.config({
				top: 250
			});
			this.getConfig(); // 其他配置查询
		},
		methods: {
			getConfig() { // 其他配置查询
				this.axios.get('/admin/settings/node_config').then(res => {
					if(res.data.code == 200) {
						res.data.data.forEach((row, index) => {
							if(Number(row.nodeId) == 0) {
								res.data.data.splice(index, 1);
							}
						})
						this.configList = res.data.data;
						this.loading = false;
					}
				})
			},
			editSubmit() {
				if(this.edit.allRatio === '') {
					this.$Message.info('等级名称不能为空');
					return false;
				}
				if(this.edit.allRatio === '') {
					this.$Message.info('节点全网奖励比例不能为空');
					return false;
				}
				if(!this.edit.conditionAccoutValue) {
					this.$Message.info('账户价值不能为空');
					return false;
				}
				if(!this.edit.conditionNodeValue) {
					this.$Message.info('节点下所有会员价值不能为空');
					return false;
				}
				if(!this.edit.ratio) {
					this.$Message.info('节点奖励比例不能为空');
					return false;
				}
				let params = this.qs.stringify({
					id: this.edit.id,
					allRatio: this.edit.allRatio,
					conditionAccoutValue: this.edit.conditionAccoutValue,
					conditionNodeValue: this.edit.conditionNodeValue,
					ratio: this.edit.ratio,
					nodeName: this.edit.nodeName
				})
				this.axios.put('/admin/settings/node_config', params).then(res => {
					if(res.data.code == 200) {
						this.$Message.info(res.data.msg);
						this.modal1 = false;
						this.getConfig();
						this.edit = {
							allRatio: '',
							conditionAccoutValue: '',
							conditionNodeValue: '',
							ratio: '',
						}
					}
				}).catch(err => {
					this.$Message.info('系统错误');
				})
			},
		}
	}
</script>

<style lang="less" scoped>
	.p-10 {
		padding-top: 0 !important;
		padding-left: 50px !important;
	}
	
	.w50 {
		width: 50px !important;
	}
	
	.w25 {
		width: 25px !important;
	}
	
	.w120 {
		width: 120px !important;
	}
	
	.mar {
		margin-left: 5px;
	}
	
	.pl-100 {
		padding-left: 100px;
	}
</style>